<template>
	<div id="agentCenter">
		<p class="Title">您好,{{nickName}}</p>
		<!-----------资金明细------------>
		<div class="center_1">
			<img src="../../static/img/recharge-01.png"/>
			<div class="recharge_1_text">
				<p class="recharge_1_title">资金明细</p>
				<div class="recharge_1_content">
					<p>当前可用余额：<span>{{returnFloat(balance)}}元</span></p>
					<p>担保任务资金：<span>{{returnFloat(freeze)}}元</span></p>
					<!--<p>提现中：<span>{{returnFloat(putForward)}}元</span></p>-->
					<!--<p>推广获利：<span>{{returnFloat(spread)}}元</span></p>-->
				</div>
			</div>
		</div>
		<!---------功能列表-------------->
		<ul class="center_2">
			<li>
				<router-link to="/agent/recharge">
					<img src="../../static/img/agentCenter-01.png"/>
					<p>充值</p>
				</router-link>
				
			</li>
			<li>
				<router-link :to="{path:'/agent/withdrawal',query:{type:2}}">
					<img src="../../static/img/agentCenter-02.png"/>
					<p>账户明细</p>
				</router-link>
			</li>
			<!--<li>
				<router-link :to="{path:'/agent/withdrawal',query:{type:1}}">
					<img src="../../static/img/agentCenter-03.png"/>
					<p>提现</p>
				</router-link>
			</li>-->
			<li>
				<router-link to="/agent/information">
					<img src="../../static/img/agentCenter-05.png"/>
					<p>个人资料</p>
				</router-link>
			</li>
		</ul>
		<ul class="center_2">
			<li>
				<p>待支付：</p>
				<span>{{count1}}</span>
			</li>
			<li>
				<p>进行中：</p>
				<span>{{count2}}</span>
			</li>
			<li>
				<p>已完成：</p>
				<span>{{count3}}</span>
			</li>
		</ul>
		<!-----------系统消息、平台公告--------------->
		<div class="center_3">
			<div class="center_3_item">
				<p class="center_3_title">系统消息</p>
				<ul>
					<router-link v-for="(item,key) in newsList" :to="{path:'/agent/news',query:{indexKey:key,id:1}}">
						<li>
							<p class="new_title"><span></span>{{item.title}}</p>
							<p class="new_time">{{getDate(item.createtime)}}</p>
						</li>
					</router-link>
				</ul>
			</div>
			<div class="center_3_item">
				<p class="center_3_title">平台公告</p>
				<ul>
					<router-link v-for="(item,key) in noticeList" :to="{path:'/agent/news',query:{indexKey2:key,id:2}}">
						<li>
							<p class="notice_title"><span></span>{{item.noticeTitle}}</p>
							<p class="notice_time">{{getDate(item.createtime)}}</p>
						</li>
					</router-link>
				</ul>
			</div>
		</div>
	</div>
</template>

<script>
export default {
	name: 'agentCenter',
	data:function(){
		return{
			nickName:'',
			count1:0,//待支付个数
			count2:0,//进行中个数
			count3:0,//已完成个数
			balance: '1.5',//余额
			freeze: '0',//冻结资金
			putForward: '0',//提现中
			spread: '0',//推广获利
			newsList:[//系统消息列表
				{
					agId: 1,
					title: '系统消息标题',
					createtime: 1514779200000,//时间
				},
				{
					agId: 2,
					title: '系统消息标题',
					createtime: 1514779200000,//时间
				},
				{
					agId: 2,
					title: '系统消息标题',
					createtime: 1514779200000,//时间
				},
				{
					agId: 2,
					title: '系统消息标题',
					createtime: 1514779200000,//时间
				},
				{
					agId: 2,
					title: '系统消息标题',
					createtime: 1514779200000,//时间
				},
			],
			noticeList:[//平台公告列表
				{
					title: '公告消息标题',
					createtime: 1514779200000,//时间
				},
				{
					title: '公告消息标题',
					createtime: 1514779200000,//时间
				},
				{
					title: '公告消息标题',
					createtime: 1514779200000,//时间
				},
				{
					title: '公告消息标题',
					createtime: 1514779200000,//时间
				},
				{
					title: '公告消息标题',
					createtime: 1514779200000,//时间
				},
			]
		}
	},
	methods:{
		//--------小数点后两位不够补零---------------
		returnFloat:function(value){
			var value=Math.round(parseFloat(value)*100)/100;
			var xsd=value.toString().split(".");
			if(xsd.length==1){
				value=value.toString()+".00";
				return value;
			}
			if(xsd.length>1){
				if(xsd[1].length<2){
					value=value.toString()+"0";
				}
				return value;
			}
		},
		showInfo: function(){
			var _this = this;
			_this.$axios.post('/agent/info/show').then(function(res){
			    var data = res.data.result;
		    	_this.nickName = data.phone;
			}).catch(function (error) {
			    console.log(error);
			});
		},
		showWallet:function(){
			var _this  = this;
			_this.$axios.post('/agent/wallet/show').then(function(res){
				var data = res.data;
				if(data.message=="succ"){
					data = data.result;
					_this.balance = data.balance;
					_this.freeze = data.guaranteeBalance;
					_this.spread = data.allExtendsMoney;
				}else{
					_this.$alert('2',data.result);
				}
			}).catch(function(error){
				console.log(error);
			});
		},
		showStatusCount:function(){
			var _this = this;
			_this.$axios.post('/agent/task/showCount').then(function(res){
				var data = res.data;
				if(data.message=="succ"){
					data = data.result;
					_this.count1 = data.count1;
					_this.count2 = data.count2;
					_this.count3 = data.count3;
				}else{
					_this.$alert('2',data.result);
				}
			}).catch(function(error){
				_this.$alert('2',data.result);
			});
		},
		showAgNotice:function(){
			var _this = this;
			var postData = _this.$qs.stringify({
				type:2,
				status:1,
				startPage:1,
				pageSize:5,
	    	 })
			_this.$axios.post('/agent/notice/public/show',postData).then(function(res){
					var data = res.data;
					if(data.message=="succ"){
						_this.noticeList = data.result;
					}else{
						_this.$alert('2',data.result);
					}
			}).catch(function(error){
				console.log(error);
			});
		},
		showMessage: function(){
			var _this = this;
			var postData = this.$qs.stringify({
	        	startPage: 1,
	        	pageSize: 5
	        })
			_this.$axios.post('/agent/message/show', postData).then(function(res){
			    var data = res.data;
			    console.log(data);
			    if(data.message=="succ"){
			    	_this.newsList = data.result.list;
			    }else{
			    	_this.$alert('2',data.result);
			    }
			}).catch(function (error) {
			    console.log(error);
			});
		},
		//--------日期转换-----------
		getDate: function(str){  
			if(str == ""||str ==null){
				return "";
			}
		    var oDate = new Date(str),  
		    oYear = oDate.getFullYear(),  
		    oMonth = oDate.getMonth()+1,  
		    oDay = oDate.getDate(),  
		    oHour = oDate.getHours(),  
		    oMin = oDate.getMinutes(),  
		    oSen = oDate.getSeconds(),  
		    oTime = oYear +'-'+ this.getzf(oMonth) +'-'+ this.getzf(oDay);//最后拼接时间  
		    return oTime;  
		},
		//补0操作  
		getzf:function(num){  
		    if(parseInt(num) < 10){  
		        num = '0'+num;  
		    }  
		    return num;  
		}
	},
	created:function(){
		this.showInfo();
		this.showWallet();
		this.showStatusCount();
		this.showAgNotice();
		this.showMessage();
	},
}
</script>

<style scoped>
#agentCenter{
	width: 1030px;
	background-color: #fff;
	padding: 30px;
	padding-bottom: 10px;
	box-sizing: border-box;
}
.Title{
	font-size: 20px;
	color: #545454;
}
/*-------资金明细--------*/
.center_1{
	display: flex;
	align-items: center;
	border: 1px solid #e6e6e6;
	padding: 20px 30px;
	box-sizing: border-box;
	margin-top: 20px;
}
.center_1 img{
	height: 50px;
	display: block;
	margin-right: 10px;
}
.center_1 .recharge_1_text{
	height: 50px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.recharge_1_title{
	font-size: 16px;
	color: #545454;
}
.recharge_1_content{
	display: flex;
}
.recharge_1_content p{
	margin-right: 30px;
	color: #545454;
}
.recharge_1_content p span{
	color: #FF464E;
}
/*-------功能列表-----------*/
.center_2{
	width: 100%;
	border: 1px solid #E6E6E6;
	display: flex;
	align-items: center;
	height: 50px;
	box-sizing: border-box;
	margin-top: 15px;
	font-size: 16px;
	color: #545454;
}
.center_2 li{
	width: 50%;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-right: 1px solid #E6E6E6;
}
.center_2 li:last-child{
	border-right: none;
}
.center_2 li a{
	width: 100%;
	height: 100%;
	display: block;
	display: flex;
	align-items: center;
	justify-content: center;
}
.center_2 li img{
	height: 24px;
	display: block;
	margin-right: 5px;
}
.center_2 li span{
	font-size: 18px;
	color: #FF464E;
	font-weight: 600;
}
/*---------系统消息，平台公告------------*/
.center_3{
	display: flex;
	border: 1px solid #E6E6E6;
	box-sizing: border-box;
	padding-bottom: 20px;
	margin-top: 15px;
}
.center_3_item{
	width: 50%;
}
.center_3_title{
	font-size: 16px;
	color: #545454;
	padding: 15px 30px;
	padding-top: 20px;
	box-sizing: border-box;
}
.center_3_item ul{
	padding: 0 30px;
	box-sizing: border-box;
}
.center_3_item:first-child ul{
	border-right: 1px solid #E6E6E6;
}
.center_3_item ul a{
	width: 100%;
	display: block;
}
.center_3_item ul li{
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 40px;
	border-bottom: 1px solid #E6E6E6;
}
.center_3_item ul a:last-child li{
	border-bottom: none;
}
.center_3_item ul li p:first-child{
	width: 70%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: flex;
	align-items: center;
}
.center_3_item ul li p:first-child span{
	width: 6px;
	height: 6px;
	display: inline-block;
	border-radius: 50%;
	background-color: #FF464E;
	margin-right: 5px;
}
</style>
